@import '../styles/main.less';

.home-container {
    .home-nav {
        height: 46px;
        line-height: 46px;
        border-bottom: @border;
        background-color: #fff;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
        transition: all 0.2s;
        transform: translateZ(0);
        nav {
            .ct;
            .list;
            ul {
                .list;
                justify-content: center;
                height: 100%;
                margin: 0;
                li {
                    margin-right: 15px;
                    cursor: pointer;
                    a {
                        color: @color6;
                        text-decoration: none;
                    }
                    &:hover {
                        a {
                            color: @primary;
                        }
                    }
                    a.active {
                        color: @primary;
                    }
                }
                // li.activeLi{
                //     a{
                //         color:@primary;
                //     }
                // }
            }
            a {
                height: 100%;
            }
        }
    }
    .secondNav {
        height: 50px;
        line-height: 50px;
        overflow: hidden;
        background: @colorF;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
        .list;
        flex: 1 auto 1;
        justify-content: flex-start;
        ul {
            .list;
            width: 82%;
            height: 100%;
            margin: 0;
            margin-left: 20px;
            justify-content: flex-start;
            li {
                cursor: pointer;
                padding: 0 15px;
                color: @primary;
                display: flex;
                align-items: center;
            }
        }
        > a {
            color: @color6;
            &:hover {
                color: @primary;
            }
        }
    }
    .article-container {
        margin-top: 1px;
        background: @colorF;
        .sort-tag {
            .list;
            height: 46px;
            line-height: 46px;
            border-bottom: 1px solid hsla(0, 0%, 59.2%, 0.1);
            &:first-child {
                .ant-tag {
                    position: relative;
                    &::after {
                        content: '|';
                        position: absolute;
                        top: -1px;
                        right: -5px;
                    }
                    &:last-child::after {
                        content: '';
                    }
                }
            }
        }
    }
    .linkCard {
        img {
            width: 36px;
            height: 36px;
        }
        .ant-list-item-meta-title {
            margin: 0;
            margin-top: 7px;
            .overflow-ellipsis;
        }
        .ant-list-item {
            border-bottom: none;
        }
    }
}

.ant-popover-inner-content {
    padding: 0 !important;
    ul {
        li:hover {
            background: #f7f8fa;
        }
    }
}

.article-list {
    .ant-list-item {
        justify-content: space-between;
        padding: 15px;
        border-bottom: 1px solid hsla(0, 0%, 59.2%, 0.1);
        cursor: pointer;
        &:hover {
            background: #fcfcfc;
            .list-part3 i {
                display: inline-block;
            }
        }
    }
}
.list-part1 {
    ul {
        .list;
        justify-content: flex-start;
        li {
            position: relative;
            color: @color6;
            &.item.post {
                font-weight: 500;
                color: rgb(183, 30, 215);
            }
            &::after {
                content: '·';
                color: rgb(178, 186, 194);
                margin: 0px 5px;
            }
            &:last-child::after {
                content: '';
            }
            > a {
                position: relative;
                color: @color6;
                &:hover {
                    color: @primary;
                }
                &::after {
                    content: '/';
                    margin: 0 5px;
                }
                &:last-child::after {
                    content: '';
                }
            }
        }
    }
}
.list-part2 {
    a {
        color: #2e3135;
        font-size: 18px;
        font-weight: 600;
        &:hover {
            color: @primary;
            text-decoration: underline;
        }
    }
}
.list-part3 > div {
    .list;
    margin-top: 10px;
    justify-content: flex-start;
    .ant-statistic {
        height: 24px;
        line-height: 20px;
        padding: 0 10px;
        white-space: nowrap;
        color: #b2bac2;
        border-radius: 1px;
        border: 1px solid #edeeef;
        .ant-statistic-content {
            font-size: 16px;
        }
        &:first-child {
            border-right: none !important;
        }
        &:hover {
            background: #f7f8fa;
        }
    }
    > i {
        display: none;
        height: 24px;
        line-height: 26px;
        padding: 0 10px;
        white-space: nowrap;
        color: #b2bac2;
        border-radius: 1px;
        border: 1px solid #edeeef;
        &:hover {
            background: #f7f8fa;
        }
    }
    .link-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 24px;
        border: 1px solid #edeeef;
        border-radius: 1px;
        padding-left: 14px;
        padding-right: 14px;
        color: #b3bac1;
        font-size: 14px;
        white-space: nowrap;
    }
    .link-btn.sale,
    .link-btn.share {
        margin-left: -1px;
    }
}
